<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" />
<style type="text/css">
* { margin: 0px; padding: 0px; outline:none;}
li { list-style: none;}
img { border: 0px;}
a { text-decoration: none; -webkit-tap-highlight-color:rgba(255,255,255,0)}
img.block_img { display: block; width: 100%;}
body { width: 100%;}
.J_ping { width: 100%;}
.pr_con { position: relative;}
.o_h { overflow: hidden;}
.text_con { display: block; width: 100%; height: 100%;
display: box; 
display: -webkit-box; 
display: -moz-box; 
position: absolute;
top: 0;
left: 0;
-webkit-box-align:center; 
-moz-box-align:center;
 color: #999999;}
.f_12 { font-size: 12px;}
.air { color: #999;}
.air b { font-weight: normal;}
.h_center { -webkit-box-pack:center; 
-moz-box-pack:center; }
.time { color: #ffffff; width: 31.5%; left: 22%; padding-top: .4%; font-size: 10px; white-space: nowrap;}
#tab { overflow: hidden; z-index: 1; border-top:1px solid #eee; }
#tab a { width: 25%; display: inline-block; height: 100%; color: #666666; float: left; 
border-bottom:1px solid #eee;
margin-top: -1px;
display: box; 
display: -webkit-box; 
display: -moz-box; 
-webkit-box-align:center; 
-moz-box-align:center;
-webkit-box-pack:center; 
-moz-box-pack:center;
font-size: 14px;
position: relative; z-index:2;
background: #fff;
}
#tab a.cur { color: #ff5e2d; border-bottom: 1px solid #ff5e2d}
.cap { position: fixed; z-index: 10; width: 100%; height: 100%; left: 50%; top: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); background: rgba(0,0,0,0.7); display: none;}
.cap .inner { width: 90%; margin: 20% auto 0}
.cap .inner .top,.cap .inner .bottom { display: block; width: 100%;}
.cap .inner .list { background: #e4334c; overflow: hidden; padding-left: 2%; padding-top: 1%;}
.cap .inner .item { display: block; width: 45.5%; float: left; margin-bottom: 3%; margin-left: 2%;}
.m_link { height: 95%; width: 20%; position: absolute; right: 0; bottom: -15%; text-indent: -999em; overflow: hidden;}
#quan_info { display: none}

.pd_group ul { overflow: hidden; }
.pd_group li { padding: 10px 12px 0px; border-bottom: .5px solid #d8e1ec; margin-bottom: 5px; }
.pd_group li:last-child { border-bottom: 0px; margin-bottom: 0px;}
.pd_group li a { text-decoration: none;}
.pd_group .left { float: left; width:35%;  text-align: center; }
.pd_group .left img { display: inline-block; width: 85%}
.pd_group .left .txt_wrap { display: none;}
.pd_group .right .img_wrap { display: none;}
.pd_group .right { width: 65%; float: right; position: relative;}
.txt_wrap .name { color: #333333; font-size: 14px; height: 32px; line-height: 16px; overflow: hidden;  }
.txt_wrap .desc { color: #999999; margin-bottom: 5px; font-size: 12px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}
.txt_wrap .price { font-size: 20px; color: #ff5e2d; overflow: hidden; white-space: nowrap; }
.txt_wrap .price i.yang { font-style: normal; margin-right: 1px; font-size: 16px; font-weight: normal; }
.pd_group .right .buy_icon { position: absolute; width: 13%; display: block; right: 1%; bottom: 1.5%;}

#container,#pd_list {
  overflow: hidden;
  visibility: hidden;
  position: relative;
}
.swipe-wrap {
  overflow: hidden;
  position: relative;
}
.swipe-wrap > div {
  float:left;
  width:100%;
  position: relative;
}
.pd_list ul { padding-left: .6%;}
.pd_list li { float: left; width: 43%; margin:1%; padding: 2%; text-align: left; border: 1px solid #ebebeb; }
.pd_list li .pd_pic { height: 100px; margin: 0px auto; display: inline-block; width:100px; display: block; }
.pd_list li .pd_name { font-size: 12px; display: block; line-height: 14px; height: 28px; overflow: hidden; padding: 2px 0px; color: #535353;}
.pd_list li .pd_price { color: #ff1f3f; font-weight: bold; font-size: 16px; padding-bottom: 2px;}
.pd_list li .pd_price:first-letter { font-size: 12px; font-weight: normal; padding: 3px 3px 6px;}
.pd_list li .pd_buy { width: 100%; display: block; }
.trigger { text-align:center; height: 10px; }
 /*.trigger span{display:inline-block;width:5px;background:url("") no-repeat top left;background-size:100% auto;height:10px;margin-right:2px} .trigger span:last-child{margin-right:0} .trigger span.cur{background-image:url("")}*/
 .choose{border-top:1px solid #eaeaea;padding-top:5%}
 #scroller { width: 100%; overflow:scroll;
 
 
 -webkit-overflow-scrolling: touch;
 -ms-scroll-chaining: chained;

padding-bottom:10px;
}
.mt_10 { position: relative; margin-top: -10px; z-index: 9}
#scroller { display: none;}
#scroller .scroll_img { overflow: hidden; float: left; margin-right: 5px; min-height: 100px; border: 5px solid #008fea; background:#ffffff }
#scroller .scroll_img:nth-child(even) { border-color:#c24cff; } 
#scroller .scroll_img .title { position: relative; overflow: visible; font-size: 12px; color: #fff; background: #008fea; padding-bottom: 2px; padding-left: 10%; height: 14px; }
#scroller .scroll_img:nth-child(even) .title { background: #c24cff; }
#scroller .scroll_img .title .icon { position: absolute; left: 2%; bottom: -30%; width: 6%;}
#scroller .scroll_img .title .icon2 { font-size: 40px; position: absolute; left: -4%; bottom: -80%; font-weight: bold; width: 6%; color: #008fea }
#scroller .scroll_img:nth-child(even) .title .icon2 { color: #c24cff}
#scroller .scroll_img .title .t_left { display: inline-block; height: 14px; line-height: 14px;}
#scroller .scroll_img .title .t_right { display: inline-block; float: right; height: 14px; line-height: 14px;}
#scroller .scroll_img .pd_con .p_left { float: left; width: 56%; padding: 5% 2%;}
#scroller .scroll_img .pd_con .p_right { float: left; width: 40%;}
#scroller .scroll_img .pd_con .p_right .pd_pic { width: 95%; margin-left: 2%; margin-top: 15%; display: block; }
#scroller .scroll_img .pd_con .p_left .pd_name { margin-bottom: 2px; color: #535353; height: 28px; font-size: 12px; line-height: 14px; overflow: hidden;}
#scroller .scroll_img .pd_con .p_left .pd_price { color: #ff1f3f; margin-bottom: 5px; font-size: 14px; font-weight: bold;}
#scroller .scroll_img .pd_con .p_left .pd_price:first-letter { font-size: 12px; font-weight: normal;}
#scroller .scroll_img .pd_con .p_left .pd_promotion { white-space: nowrap; overflow: hidden; text-overflow:ellipsis; height: 14px; line-height: 14px; margin-bottom: 8px; font-size: 12px; color: #a3a3a3; }
#scroller .scroll_img .pd_con .p_left .pd_buy { width: 80%; display: block;} 
#scroller_inner { overflow: hidden;}
</style>
<script src="http://libs.baidu.com/zepto/0.8/zepto.min.js"></script>
</head>
<body>
	<div class="cap" id="cap">
        <div class="inner">
            <img src="img/a_14.png" class="top" onclick="$('#cap').hide();">
            <div class="list" id="cap_list">
                
                <a data-id="new-2932" class="J_coupon" href="javascript:void(0)"><img class="item" src="http://img2.icson.com/event/2015/07/03/14358943977960.png"/></a>
                <a data-id="new-2932" class="J_coupon" href="javascript:void(0)"><img class="item" src="http://img2.icson.com/event/2015/07/03/14358943977960.png"/></a>
                <a data-id="new-2932" class="J_coupon" href="javascript:void(0)"><img class="item" src="http://img2.icson.com/event/2015/07/03/14358943977960.png"/></a>
                <a data-id="new-2932" class="J_coupon" href="javascript:void(0)"><img class="item" src="http://img2.icson.com/event/2015/07/03/14358943977960.png"/></a>
                <a data-id="new-2932" class="J_coupon" href="javascript:void(0)"><img class="item" src="http://img2.icson.com/event/2015/07/03/14358943977960.png"/></a>
                <a data-id="new-2932" class="J_coupon" href="javascript:void(0)"><img class="item" src="http://img2.icson.com/event/2015/07/03/14358943977960.png"/></a>
                <!--
                <a data-id="new-2932" class="J_coupon" href="javascript:void(0)"><img class="item" src="http://img2.icson.com/event/2015/07/03/14358943977960.png"/></a>
                <a data-id="new-2932" class="J_coupon" href="javascript:void(0)"><img class="item" src="http://img2.icson.com/event/2015/07/03/14358943977960.png"/></a>
                -->
            </div>
            <img src="img/a_15.png" class="bottom">
        </div>
    </div>
	<div class="J_ping">
		<img src="img/a_1.jpg" class="block_img">
		<img src="img/a_2.jpg" class="block_img">
		<div class="pr_con o_h">
			<img src="img/a_3.jpg" class="block_img">
			<div class="text_con" style="padding-left:10%;"><a href="" class="air f_12">测试</a></div>
		</div>
		<div class="pr_con o_h" id="quan_info" onclick="$('#cap').show();">
			<img src="img/a_4.jpg" class="block_img">
			<div class="text_con" style="padding-left:24%; padding-top:1%;"><span class="air f_12">您还有<b id="quan_num"></b>张券可以领</span></div>
		</div>
		<div class="pr_con o_h">
			<img src="img/a_5.jpg" class="block_img">
			<div class="text_con time h_center">还剩<span id="hour"></span>小时<span id="minute"></span>分<span id="second"></span>秒</div>
		</div>
        <div class="pd_list" id="pd_list">
            <div class="swipe-wrap">
                <div>
                    <ul>
                        <li>
                            <img class="pd_pic" alt="闪迪（SanDisk）至尊极速（CZ80）32GB U盘 USB3.0 极速传输" data-src="http://img2.icson.com/product/pic200/101/005/101-005-73456.jpg" src="http://img2.icson.com/product/pic200/101/005/101-005-73456.jpg" style="background: none;">
                            <a href="" class="pd_name">名称名称名称名称名称名称名称</a>
                            <p class="pd_price">¥156</p>
                            <a href=""><img src="img/a_11.jpg" class="pd_buy"></a>
                        </li>
                        <li>
                            <img class="pd_pic" alt="闪迪（SanDisk）至尊极速（CZ80）32GB U盘 USB3.0 极速传输" data-src="http://img2.icson.com/product/pic200/101/005/101-005-73456.jpg" src="http://img2.icson.com/product/pic200/101/005/101-005-73456.jpg" style="background: none;">
                            <a href="" class="pd_name">名称名称名称名称名称名称名称</a>
                            <p class="pd_price">¥156</p>
                            <a href=""><img src="img/a_11.jpg" class="pd_buy"></a>
                        </li>
                    </ul>
                </div>
                <div>
                    <ul>
                        <li>
                            <img class="pd_pic" alt="闪迪（SanDisk）至尊极速（CZ80）32GB U盘 USB3.0 极速传输" data-src="http://img2.icson.com/product/pic200/101/005/101-005-73456.jpg" src="http://img2.icson.com/product/pic200/101/005/101-005-73456.jpg" style="background: none;">
                            <a href="" class="pd_name">名称名称名称名称名称名称名称</a>
                            <p class="pd_price">¥156</p>
                            <a href=""><img src="img/a_11.jpg" class="pd_buy"></a>
                        </li>
                        <li>
                            <img class="pd_pic" alt="闪迪（SanDisk）至尊极速（CZ80）32GB U盘 USB3.0 极速传输" data-src="http://img2.icson.com/product/pic200/101/005/101-005-73456.jpg" src="http://img2.icson.com/product/pic200/101/005/101-005-73456.jpg" style="background: none;">
                            <a href="" class="pd_name">名称名称名称名称名称名称名称</a>
                            <p class="pd_price">¥156</p>
                            <a href=""><img src="img/a_11.jpg" class="pd_buy"></a>
                        </li>
                    </ul>
                </div>
                <div>
                    <ul>
                        <li>
                            <img class="pd_pic" alt="闪迪（SanDisk）至尊极速（CZ80）32GB U盘 USB3.0 极速传输" data-src="http://img2.icson.com/product/pic200/101/005/101-005-73456.jpg" src="http://img2.icson.com/product/pic200/101/005/101-005-73456.jpg" style="background: none;">
                            <a href="" class="pd_name">名称名称名称名称名称名称名称</a>
                            <p class="pd_price">¥156</p>
                            <a href=""><img src="img/a_11.jpg" class="pd_buy"></a>
                        </li>
                        <li>
                            <img class="pd_pic" alt="闪迪（SanDisk）至尊极速（CZ80）32GB U盘 USB3.0 极速传输" data-src="http://img2.icson.com/product/pic200/101/005/101-005-73456.jpg" src="http://img2.icson.com/product/pic200/101/005/101-005-73456.jpg" style="background: none;">
                            <a href="" class="pd_name">名称名称名称名称名称名称名称</a>
                            <p class="pd_price">¥156</p>
                            <a href=""><img src="img/a_11.jpg" class="pd_buy"></a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
        <div class="trigger" id="trigger">
           
        </div>
		<div class="pr_con o_h">     
			<img src="img/a_7.jpg" class="block_img">
			<a href="" class="m_link">更多</a>
		</div>
        <div id="scroller">
            <ul class="inner" id="scroller_inner">
                    <li class="scroll_img">
                        <div class="title">
                            <span class="icon2"/>▼</span>
                            <img src="img/a_12.png" class="icon"/>
                            <span class="t_left">6月12日</span>
                            <span class="t_right">超级品牌日</span>
                        </div>
                        <a class="pd_con" href="#">
                            <div class="p_left">
                                <p class="pd_name">小米NOTE顶配版</p>
                                <p class="pd_promotion">骁龙810处理器3GB</p>
                                <p class="pd_price">￥2088.00</p>
                                <img src="img/a_13.png" class="pd_buy">
                            </div>
                            <div class="p_right">
                                <img src="http://img2.wgimg.com/qqbuy/690242058/item-0000000000000000000000722924420A.0.jpg/120?5595E6C7" class="pd_pic">
                            </div>
                        </a>
                    </li>
                    <li class="scroll_img">
                        <div class="title">
                            <span class="icon2"/>▼</span>
                            <img src="img/a_12.png" class="icon"/>
                            <span class="t_left">6月13日</span>
                            <span class="t_right">超级品牌日</span>
                        </div>
                        <a class="pd_con" href="#">
                            <div class="p_left">
                                <p class="pd_name">小米NOTE顶配版小米NOTE顶配版小米NOTE顶配版</p>
                                <p class="pd_promotion">骁龙810处理器3GB骁龙810处理器3GB</p>
                                <p class="pd_price">￥2088.00</p>
                                <img src="img/a_13.png" class="pd_buy">
                            </div>
                            <div class="p_right">
                                <img src="http://img2.wgimg.com/qqbuy/690242058/item-0000000000000000000000722924420A.0.jpg/120?5595E6C7" class="pd_pic">
                            </div>
                        </a>
                    </li>
                    <li class="scroll_img">
                        <div class="title">
                            <span class="icon2"/>▼</span>
                            <img src="img/a_12.png" class="icon"/>
                            <span class="t_left">6月12日</span>
                            <span class="t_right">超级品牌日</span>
                        </div>
                        <a class="pd_con" href="#">
                            <div class="p_left">
                                <p class="pd_name">小米NOTE顶配版</p>
                                <p class="pd_promotion">骁龙810处理器3GB</p>
                                <p class="pd_price">￥2088.00</p>
                                <img src="img/a_13.png" class="pd_buy">
                            </div>
                            <div class="p_right">
                                <img src="http://img2.wgimg.com/qqbuy/690242058/item-0000000000000000000000722924420A.0.jpg/120?5595E6C7" class="pd_pic">
                            </div>
                        </a>
                    </li>
                    <li class="scroll_img">
                        <div class="title">
                            <span class="icon2"/>▼</span>
                            <img src="img/a_12.png" class="icon"/>
                            <span class="t_left">6月12日</span>
                            <span class="t_right">超级品牌日</span>
                        </div>
                        <a class="pd_con" href="#">
                            <div class="p_left">
                                <p class="pd_name">小米NOTE顶配版</p>
                                <p class="pd_promotion">骁龙810处理器3GB</p>
                                <p class="pd_price">￥2088.00</p>
                                <img src="img/a_13.png" class="pd_buy">
                            </div>
                            <div class="p_right">
                                <img src="http://img2.wgimg.com/qqbuy/690242058/item-0000000000000000000000722924420A.0.jpg/120?5595E6C7" class="pd_pic">
                            </div>
                        </a>
                    </li>
            </ul>   
        </div>
        <!-- </div> -->
		<img src="img/a_9.jpg" class="block_img mt_10">
		<div class="pr_con">
			<img src="img/a_10.jpg" class="block_img">	
			<div class="text_con" id="tab">
				<a href="javascript:void(0)" class="cur">手机</a>
				<a href="javascript:void(0)">充电宝</a>
				<a href="javascript:void(0)">耳机</a>
				<a href="javascript:void(0)">手机配件</a>
			</div>
		</div>
        <div id="container">
            <div class="swipe-wrap pd_group">
            <div>
                <ul>
                    <li>
                        <div class="left"><a href="#" class="J_ytag J_product_item J_product_item_1963226" data-pid="1963226" data-mprice="700" ytag="20010">
                            <p class="img_wrap"><img alt="闪迪（SanDisk）至尊极速（CZ80）32GB U盘 USB3.0 极速传输" data-src="http://img2.icson.com/product/pic200/101/005/101-005-73456.jpg" src="http://img2.icson.com/product/pic200/101/005/101-005-73456.jpg" style="background: none;"></p>
                            
                        </a></div>
                        <div class="right"><a href="#" class="J_ytag J_product_item J_product_item_1963226" data-pid="1963226" data-mprice="700" ytag="20011">
                            
                            <div class="txt_wrap">
                                <p class="name">闪迪（SanDisk）至尊极速（CZ80）32GB U盘 USB3.0 极速传输</p>
                                <p class="desc">占位</p>
                                <p class="price y_pf"><b class="num"><i class="yang">¥</i>156</b></p>
                            </div>
                        </a><a href="#" class="J_ytag J_product_item J_product_item_1963226" data-pid="1963226" data-mprice="700" ytag="20012"><img src="http://img2.icson.com/event/2015/05/22/14322632482833.png" class="buy_icon"></a></div><div class="clearfix"></div>
                    </li>
                </ul>
            </div>
            <div>
                <ul>
                    <li>
                        <div class="left"><a href="#" class="J_ytag J_product_item J_product_item_1963226" data-pid="1963226" data-mprice="700" ytag="20010">
                            <p class="img_wrap"><img alt="闪迪（SanDisk）至尊极速（CZ80）32GB U盘 USB3.0 极速传输" data-src="http://img2.icson.com/product/pic200/101/005/101-005-73456.jpg" src="http://img2.icson.com/product/pic200/101/005/101-005-73456.jpg" style="background: none;"></p>
                            
                        </a></div>
                        <div class="right"><a href="#" class="J_ytag J_product_item J_product_item_1963226" data-pid="1963226" data-mprice="700" ytag="20011">
                            
                            <div class="txt_wrap">
                                <p class="name">闪迪（SanDisk）至尊极速（CZ80）32GB U盘 USB3.0 极速传输</p>
                                <p class="desc">占位</p>
                                <p class="price y_pf"><b class="num"><i class="yang">¥</i>156</b></p>
                            </div>
                        </a><a href="#" class="J_ytag J_product_item J_product_item_1963226" data-pid="1963226" data-mprice="700" ytag="20012"><img src="http://img2.icson.com/event/2015/05/22/14322632482833.png" class="buy_icon"></a></div><div class="clearfix"></div>
                    </li>
                </ul>
            </div>
            <div>
                <ul>
                    <li>
                        <div class="left"><a href="#" class="J_ytag J_product_item J_product_item_1963226" data-pid="1963226" data-mprice="700" ytag="20010">
                            <p class="img_wrap"><img alt="闪迪（SanDisk）至尊极速（CZ80）32GB U盘 USB3.0 极速传输" data-src="http://img2.icson.com/product/pic200/101/005/101-005-73456.jpg" src="http://img2.icson.com/product/pic200/101/005/101-005-73456.jpg" style="background: none;"></p>
                            
                        </a></div>
                        <div class="right"><a href="#" class="J_ytag J_product_item J_product_item_1963226" data-pid="1963226" data-mprice="700" ytag="20011">
                            
                            <div class="txt_wrap">
                                <p class="name">闪迪（SanDisk）至尊极速（CZ80）32GB U盘 USB3.0 极速传输</p>
                                <p class="desc">占位</p>
                                <p class="price y_pf"><b class="num"><i class="yang">¥</i>156</b></p>
                            </div>
                        </a><a href="#" class="J_ytag J_product_item J_product_item_1963226" data-pid="1963226" data-mprice="700" ytag="20012"><img src="http://img2.icson.com/event/2015/05/22/14322632482833.png" class="buy_icon"></a></div><div class="clearfix"></div>
                    </li>
                </ul>
            </div>
            <div>
                <ul>
                    <li>
                        <div class="left"><a href="#" class="J_ytag J_product_item J_product_item_1963226" data-pid="1963226" data-mprice="700" ytag="20010">
                            <p class="img_wrap"><img alt="闪迪（SanDisk）至尊极速（CZ80）32GB U盘 USB3.0 极速传输" data-src="http://img2.icson.com/product/pic200/101/005/101-005-73456.jpg" src="http://img2.icson.com/product/pic200/101/005/101-005-73456.jpg" style="background: none;"></p>
                            
                        </a></div>
                        <div class="right"><a href="#" class="J_ytag J_product_item J_product_item_1963226" data-pid="1963226" data-mprice="700" ytag="20011">
                            
                            <div class="txt_wrap">
                                <p class="name">闪迪（SanDisk）至尊极速（CZ80）32GB U盘 USB3.0 极速传输</p>
                                <p class="desc">占位</p>
                                <p class="price y_pf"><b class="num"><i class="yang">¥</i>156</b></p>
                            </div>
                        </a><a href="#" class="J_ytag J_product_item J_product_item_1963226" data-pid="1963226" data-mprice="700" ytag="20012"><img src="http://img2.icson.com/event/2015/05/22/14322632482833.png" class="buy_icon"></a></div><div class="clearfix"></div>
                    </li>
                </ul>
            </div>
            </div>
        </div>
	</div>
</body>
<script type="text/javascript">
function Swipe(container,options){var noop=function(){};var offloadFn=function(fn){setTimeout(fn||noop,0)};var browser={addEventListener:!!window.addEventListener,touch:("ontouchstart" in window)||window.DocumentTouch&&document instanceof DocumentTouch,transitions:(function(temp){var props=["transformProperty","WebkitTransform","MozTransform","OTransform","msTransform"];for(var i in props){if(temp.style[props[i]]!==undefined){return true}}return false})(document.createElement("swipe"))};if(!container){return}var element=container.children[0];var slides,slidePos,width;options=options||{};var index=parseInt(options.startSlide,10)||0;var speed=options.speed||300;options.continuous=options.continuous?options.continuous:true;function setup(){slides=element.children;slidePos=new Array(slides.length);width=container.getBoundingClientRect().width||container.offsetWidth;element.style.width=(slides.length*width)+"px";var pos=slides.length;while(pos--){var slide=slides[pos];slide.style.width=width+"px";slide.setAttribute("data-index",pos);if(browser.transitions){slide.style.left=(pos*-width)+"px";move(pos,index>pos?-width:(index<pos?width:0),0)}}if(!browser.transitions){element.style.left=(index*-width)+"px"}container.style.visibility="visible"}function prev(){if(index){slide(index-1)}else{if(options.continuous){slide(slides.length-1)}}}function next(){if(index<slides.length-1){slide(index+1)}else{if(options.continuous){slide(0)}}}function slide(to,slideSpeed){if(index==to){return}if(browser.transitions){var diff=Math.abs(index-to)-1;var direction=Math.abs(index-to)/(index-to);while(diff--){move((to>index?to:index)-diff-1,width*direction,0)}move(index,width*direction,slideSpeed||speed);move(to,0,slideSpeed||speed)}else{animate(index*-width,to*-width,slideSpeed||speed)}index=to;offloadFn(options.callback&&options.callback(index,slides[index]))}function move(index,dist,speed){translate(index,dist,speed);slidePos[index]=dist}function translate(index,dist,speed){var slide=slides[index];var style=slide&&slide.style;if(!style){return}style.webkitTransitionDuration=style.MozTransitionDuration=style.msTransitionDuration=style.OTransitionDuration=style.transitionDuration=speed+"ms";style.webkitTransform="translate("+dist+"px,0)"+"translateZ(0)";style.msTransform=style.MozTransform=style.OTransform="translateX("+dist+"px)"}function animate(from,to,speed){if(!speed){element.style.left=to+"px";return}var start=+new Date;var timer=setInterval(function(){var timeElap=+new Date-start;if(timeElap>speed){element.style.left=to+"px";if(delay){begin()}options.transitionEnd&&options.transitionEnd.call(event,index,slides[index]);clearInterval(timer);return}element.style.left=(((to-from)*(Math.floor((timeElap/speed)*100)/100))+from)+"px"},4)}var delay=options.auto||0;var interval;function begin(){interval=setTimeout(next,delay)}function stop(){delay=0;clearTimeout(interval)}var start={};var delta={};var isScrolling;var events={handleEvent:function(event){switch(event.type){case"touchstart":this.start(event);break;case"touchmove":this.move(event);break;case"touchend":offloadFn(this.end(event));break;case"webkitTransitionEnd":case"msTransitionEnd":case"oTransitionEnd":case"otransitionend":case"transitionend":offloadFn(this.transitionEnd(event));break;case"resize":offloadFn(setup.call());break}if(options.stopPropagation){event.stopPropagation()}},start:function(event){var touches=event.touches[0];start={x:touches.pageX,y:touches.pageY,time:+new Date};isScrolling=undefined;delta={};element.addEventListener("touchmove",this,false);element.addEventListener("touchend",this,false)},move:function(event){if(event.touches.length>1||event.scale&&event.scale!==1){return}if(options.disableScroll){event.preventDefault()}var touches=event.touches[0];delta={x:touches.pageX-start.x,y:touches.pageY-start.y};if(typeof isScrolling=="undefined"){isScrolling=!!(isScrolling||Math.abs(delta.x)<Math.abs(delta.y))}if(!isScrolling){event.preventDefault();stop();delta.x=delta.x/((!index&&delta.x>0||index==slides.length-1&&delta.x<0)?(Math.abs(delta.x)/width+1):1);translate(index-1,delta.x+slidePos[index-1],0);translate(index,delta.x+slidePos[index],0);translate(index+1,delta.x+slidePos[index+1],0)}},end:function(event){var duration=+new Date-start.time;var isValidSlide=Number(duration)<250&&Math.abs(delta.x)>20||Math.abs(delta.x)>width/2;var isPastBounds=!index&&delta.x>0||index==slides.length-1&&delta.x<0;var direction=delta.x<0;if(!isScrolling){if(isValidSlide&&!isPastBounds){if(direction){move(index-1,-width,0);move(index,slidePos[index]-width,speed);move(index+1,slidePos[index+1]-width,speed);index+=1}else{move(index+1,width,0);move(index,slidePos[index]+width,speed);move(index-1,slidePos[index-1]+width,speed);index+=-1}options.callback&&options.callback(index,slides[index])}else{move(index-1,-width,speed);move(index,0,speed);move(index+1,width,speed)}}element.removeEventListener("touchmove",events,false);element.removeEventListener("touchend",events,false)},transitionEnd:function(event){if(parseInt(event.target.getAttribute("data-index"),10)==index){if(delay){begin()
}options.transitionEnd&&options.transitionEnd.call(event,index,slides[index])}}};setup();if(delay){begin()}if(browser.addEventListener){if(browser.touch){element.addEventListener("touchstart",events,false)}if(browser.transitions){element.addEventListener("webkitTransitionEnd",events,false);element.addEventListener("msTransitionEnd",events,false);element.addEventListener("oTransitionEnd",events,false);element.addEventListener("otransitionend",events,false);element.addEventListener("transitionend",events,false)}window.addEventListener("resize",events,false)}else{window.onresize=function(){setup()}}return{setup:function(){setup()},slide:function(to,speed){slide(to,speed)},prev:function(){stop();prev()},next:function(){stop();next()},getPos:function(){return index},kill:function(){stop();element.style.width="auto";element.style.left=0;var pos=slides.length;while(pos--){var slide=slides[pos];slide.style.width="100%";slide.style.left=0;if(browser.transitions){translate(pos,0,0)}}if(browser.addEventListener){element.removeEventListener("touchstart",events,false);element.removeEventListener("webkitTransitionEnd",events,false);element.removeEventListener("msTransitionEnd",events,false);element.removeEventListener("oTransitionEnd",events,false);element.removeEventListener("otransitionend",events,false);element.removeEventListener("transitionend",events,false);window.removeEventListener("resize",events,false)}else{window.onresize=null}}}}if(window.jQuery||window.Zepto){(function($){$.fn.Swipe=function(params){return this.each(function(){$(this).data("Swipe",new Swipe($(this)[0],params))})}})(window.jQuery||window.Zepto)};
</script>
<script type="text/javascript">
var timer;
window.onload = function(){
    //alert(document.getElementById("scroller_inner").getElementsByTagName('li')[1].innerHTML);
	var quan_num = $("#cap_list").find("img").length;
    if(quan_num > 0){
        $("#quan_num").text(quan_num);
        $("#quan_info").show();
    }
   
    var slider2 =
        Swipe(document.getElementById('container'), {
        continuous: true,
        callback: function(pos) {
            t_index = pos;
            control_tab(pos);
        }
    });

    var slider =
        Swipe(document.getElementById('pd_list'), {
        continuous: true,
        auto: 3000,
        callback: function(pos) {
            control_tab_2(pos);
        }
    });

    timer = setInterval(getRTime,1000);

    for(var i = 0; i < $("#pd_list").find("ul").length; i++){
        if(i==0){
            $("<span></span>").addClass("cur").appendTo("#trigger");
        }else{  
            $("<span></span>").appendTo("#trigger");
        }
    }
    $("#tab a").click(function(evt){
        evt.preventDefault();
        $(this).siblings().removeClass("cur");
        $(this).addClass("cur");
        var index = $("#tab a").index(this);
        slider2.slide(index, 400);
    });

    var scroll_img_wid = $(window).width()/100*75;
    $("#scroller .scroll_img").width(scroll_img_wid-15);
    $("#scroller .inner").width((scroll_img_wid)*$("#scroller .scroll_img").length);
    $("#scroller").show();
    document.getElementById("scroller").scrollLeft = scroll_img_wid;
    //$("#scroller .inner").css("margin-left",-scroll_img_wid);
}

function control_tab(index){
    $("#tab a").removeClass("cur");
    $("#tab a").eq(index).addClass("cur");
}

function control_tab_2(index){
    $("#trigger span").removeClass("cur");
    $("#trigger span").eq(index).addClass("cur");
}

function getRTime(){
    var EndTime= new Date('2015/08/03 10:10:00'); //截止时间 前端路上 http://www.51xuediannao.com/qd63/
    var NowTime = new Date();
    var nowHour = NowTime.getHours();
    var LeftTime =EndTime.getTime() - NowTime.getTime();

    var d=Math.floor(LeftTime/(1000*60*60*24));
    var h=Math.floor(LeftTime/(1000*60*60)%24);
    var m=Math.floor(LeftTime/(1000*60)%60);
    var s=Math.floor(LeftTime/1000%60);

    document.getElementById("hour").innerHTML = h + d*24;
    document.getElementById("minute").innerHTML = m;
    document.getElementById("second").innerHTML = s;
    if(s==0){ clearInterval(timer); }
}
</script>
<html>